<template>
    <div>
         <h1>显示复理疗信息页面</h1>
    </div>
项目名称:
 <input type="text" v-model="ya.name">

 <input type="button" value="查询" class="btn btn-info" @click="ysa">
  <input type="button" value="批量修改状态" style="color: brown;" @click="pstaete" >
     <table class="table">
          <thead>
              <tr>
                 <td>
                     <input type="checkbox" v-model="sele" @change="taas">
                 </td>
                 <td>项目名称</td>
                <td>项目编号</td>
                <td>服务时长</td>
                <td>服务人数</td>
                <td>佣金</td>
                 <td>项目说明</td>
                <td>分类名称</td>
                <td>状态</td>            
              </tr>
          </thead>

             <tbody>
              <tr v-for="a in data">
                 <td>   
                      <input type="checkbox" v-model="iddarry" :value="a.sosConeId">
                 </td>
                 <td>{{a.sosConeNmae}}</td>
                <td>{{a.code}}</td>
                <td>{{a.sosConeSC}}</td>
                <td>{{a.sosConeNum}}</td>
                <td>{{a.price}}</td>
                 <td>{{a.sosConeType}}</td>
                <td>{{a.sosConeName}}</td>
                <td :style="a.state==true?'color:red':'color:green'">{{a.state==true?"启用":"禁用"}}</td>            
                   <td>
                      <input type="button" value="逻辑删除" style="color: brown;" @click="dele(a.sosConeId)">
                   </td>
              </tr>
          </tbody>
     </table>
   
      一共{{ya.count}}条,每页显示{{ya.size}}条,当前{{ya.mumber}}页,共{{ya.index}}页

       <input type="button" value="首页" @click="pang(1)" style="color: aqua;">
       <input type="button" value="上一页" @click="pang(2)" style="color: aquamarine;">
        <input type="button" :value="f" v-for="f in ya.mumber" @click="pa(f)" style="color: aqua;">
       <input type="button" value="下一页" @click="pang(3)" style="color: blue;">
       <input type="button" value="尾页" @click="pang(4)" style="color:cadetblue">

        <input type="mumbee" style="width: 45px;height: 45px;" v-model="ya.index"><input type="button" value="跳转" style="color: chocolate;" @click="tz">
        <select v-model="ya.size" @change="ta" style="color: burlywood;">
              <option value="0">0</option>
                <option value="1">1</option>
                  <option value="2">2</option>
                    <option value="3">3</option>
        </select>
</template>

<script setup lang="ts">
  import axios from 'axios';
   import {ref,onMounted} from 'vue';
 import moment from 'moment'

    import {useRouter} from 'vue-router';
import { table } from 'console';
     const router=useRouter();
onMounted(()=>{
    sosConeTypes();
    ShowSosCone();
})


 const dele=(id:any)=>{
     if(confirm("确认要删除吗")){
     axios.get("https://localhost:7048/api/SosCone/DeleteState?id="+id).then(res=>{
          if(res.data>0){
             alert("逻辑删除成功");
             ShowSosCone();
          }else{
                  alert("逻辑删除失败");
          }
     })
     }

 }



 const pa=(val:any)=>{
      ya.value.index=val;
      ShowSosCone();

 }

  const sele=ref(false);

 
   const taas=()=>{
     iddarry.value=[];
       if(sele.value){
    data.value.forEach(e=>{
         iddarry.value.push(e.sosConeId)
    })
       }else{
          iddarry.value=[];

       }
   }



   const iddarry=ref([]);



  const pstaete=()=>{
     axios.delete("https://localhost:7048/api/SosCone/Pstate",{params:{idsstaings:iddarry.value.toString()}}).then(res=>{
          if(res.data>0){
           alert("批量修改状态成功");
ShowSosCone();
      
          }else{
                alert("批量修改状态失败");
          }
     })
  }
  
 
  const obj=ref({
   "sosConeTypeId": 0,
    "sosConeName": ""
  })
   const sosConeTypes=()=>{
       axios.get("https://localhost:7048/api/SosConeType/sosConeTypes").then(res=>{
           obj.value=res.data;

       })
   }


    const tz=(val:any)=>{
        if(ya.value.index>1&&ya.value.index<ya.value.mumber){
             ShowSosCone();
        }else{
             ya.value.index=val;

        }
    }
 
 const ta=()=>{
      ya.value.index=1;
      ShowSosCone();

 }
 const pang=(val:any)=>{
    if(val==1){
            ya.value.index=1;
            ShowSosCone();

     }

   if(val==2&&ya.value.index>1){
            ya.value.index--;
            ShowSosCone();
            
     }

         if(val==3&&ya.value.index<ya.value.mumber){
            ya.value.index++;

            ShowSosCone();
            
     }

         if(val==4){
            ya.value.index=ya.value.mumber;
            ShowSosCone();
            
     }
 }
 const data=ref([{
     "sosConeType": "这个项目做的好，拿分红",
      "sosConeSC": 60,
      "sosConeTypeId": 1,
      "sosConeNum": 120,
      "code": "20250714381",
      "price": 30000,
      "sosConeNmae": "智慧酒店",
      "sosConeId": 2,
      "sosConeName": "医疗康复",
      "state": true
 }])

 
  const ya=ref({
     name:"",
     index:1,
     size:2,
     count:0,
     mumber:0,

  })
  const ysa=()=>{
     ShowSosCone();
    ya.value.index=1;

  }
 const ShowSosCone=()=>{
     axios.get("https://localhost:7048/api/SosCone/ShowSosCone",{params:ya.value}).then(res=>{
        data.value=res.data.mumber;
         ya.value.count=res.data.count;
         ya.value.mumber=Math.ceil(ya.value.count/ya.value.size);

     })
 }


</script>

<style scoped>

</style>